<template>
	<view class="quanbox">
		<viev class="main_list" v-if="quanList.length>0">
			<view class="quanitem"  v-for="(item,index) in quanList" :key="index">
				<view class="quanleft">
					<view class="name">
						<view v-if="item.full_quota == 0">
							立减{{item.full_quota }}元
						</view>
						<view v-else>
							满{{item.full_quota}}减{{item.reduce_quota}}
						</view>
					</view>
					<view class="form">
						{{item.title}} <text>数量:{{item.margin}}/{{item.stock}}</text>
					</view>
					<view class="time">
						{{item.begin_time}} - {{item.expire_time}}
					</view>
				</view>
				<view class="shopRight">
					<text :class="item.status == 0?'active buy':'buy'" @click="setOff(item)">{{item.status == 0 ?'上架':"下架"}} </text>
					<view class="buttonBox">
						<!-- <text class="iconfontPT iconzaixianjianli" @click="change(item)"> </text> -->
						<text class="iconfontPT iconshanchu11" @click="del(item)"> </text>
					</view>
				</view>
			</view>
		</viev>
		<view v-else>
			<noData texts="您还没添加优惠券哦"></noData>
		</view>
		<view class="add" @click="gotoadd()">
			<text>
				新增优惠券
			</text>
		</view>
	</view>
</template>

<script>
	import {
		getCoupon,
		CouponAllow,
		CouponDisabled,
		delCoupon
	} from "../../../apis/shop/api.js";
	import noData from '../../components/public/no-data.vue';
	export default {
		data() {
			return {
				quanList: [{
					begin_time: "2020.06.30 00:00:00",
					expire_time: "2020.07.31 00:00:00",
					full_quota: 30,
					id: 1,
					reduce_quota: 5,
					state: 1
				}],
				store_id: "",
				token: "",
			}
		},
		onLoad() {
			this.store_id = uni.getStorageSync("store_id");
			this.token = uni.getStorageSync("token");
			this.getlist()
		},
		onShow(e) {
			let pages = getCurrentPages();
			let currPage = pages[pages.length - 1]; //当前页面
			let that = this
			if(currPage.data.isDoRefesh){
				currPage.data.isDoRefesh = false
				that.getlist()
			}
			
		},
		methods: {
			gotoadd() {
				uni.navigateTo({
					url: "/pages/shopmanager/discount/adddiscount"
				})
			},
			change(item){
				console.log(item)
				uni.navigateTo({
					url: "/pages/shopmanager/discount/adddiscount?id="+item.id
				})
			},
			getlist() {
				let that = this;
				getCoupon({
					store_id: that.store_id,
					token: that.token
				}).then(res => {
					console.log(res)
					if (res.code == 1) {
						this.quanList = res.data.coupon;
					}
				})
			},
			setOff(item){
				let that = this
				if(item.status == 0){
					CouponAllow({
						id:item.id,
						token: that.token
					}).then(res=>{
						if(res.code == 1){
							uni.showToast({
								title:"上架成功"
							})
							that.getlist()
						}
					})
				}
				else if(item.status == 1){
					CouponDisabled({
						id:item.id,
						token: that.token
					}).then(res=>{
						if(res.code == 1){
							that.getlist()
							uni.showToast({
								title:"下架成功"
							})
							
						}
					})
				}
			},
			del(item){
				let that = this	
				delCoupon({
					ids:item.id,
					token: that.token
				}).then(res=>{
					if(res.code == 1){
						console.log(that)
						that.getlist()
						uni.showToast({
							title:"删除成功"
						})
						
					}
				})
			},
		}
	}
</script>

<style lang="less">
	.quanbox {
		box-sizing: border-box;
		width: 100%;
		padding: 0 30rpx 160rpx 30rpx;

		.quanitem {
			background: rgba(255, 255, 255, 1);
			box-shadow: 0px 4px 15px 0px rgba(0, 0, 0, 0.1);
			color: #676767;
			height: 180rpx;
			margin-top: 20rpx;
			padding: 15rpx 0;
			padding-right: 20rpx;

			&::after {
				content: "";
				display: block;
				height: 0;
				overflow: hidden;
				clear: both;
			}

			.quanleft {
				width: calc(~"100% - 230rpx");
				float: left;
				padding-left: 15rpx;

				.name {
					font-size: 36rpx;
					color: #E41805;
					view{
						font-size: 36rpx;
					}
					text {
						font-size: 36rpx;
						margin-right: 10rpx;
					}
				}

				.form {
					font-size: 24rpx;
					color: #666;
					margin: 15rpx 0;
					text {
						float: right;
					}
				}

				.time {
					font-size: 24rpx;
					color: #676767;
				}
			}

			.shopRight {
				float: right;
				text-align: center;
				height: 100%;
				position: relative;

				.buy {
					display: block;
					width: 100rpx;
					height: 50rpx;
					line-height: 50rpx;
					text-align: center;
					color: #CCCCCC;
					background-color: #f8f8f8;
					border-radius: 25rpx;
					font-size: 24rpx;
					&.active {
						background-color: #E41805;
						color: #fff;
					}
				}

				.buttonBox {
					position: absolute;
					bottom: 0;
					left: 0;
					right: 0;
					text-align: right;

					text {
						font-size: 30rpx;
						color: #333;
						&:nth-child(2) {
							float: right;
							font-size: 34rpx;
						}
					}
				}
			}
		}
		
		.add {
			position: fixed;
			left: 0;
			right: 0;
			bottom: 0;
			padding: 30rpx;
			box-shadow: -1rpx -2rpx 7rpx 0rpx rgba(0, 0, 0, 0.1);
			background-color: #fff;
		
			text {
				display: block;
				padding: 20rpx 0;
				background-color: #e41805;
				color: #fff;
				text-align: center;
				border-radius: 10rpx;
			}
		}
	}
</style>
